<template>
  <a-modal
      v-model:visible="bindVisible"
      :title="$t('taskLogResponseInfo.responseInfo')"
      :cancelText="$t('operation.cancel')"
      :okText="$t('operation.confirm')"
      @ok="confirm"
  >
    <p>{{$t('taskLogResponseInfo.httpStatus')}} : {{form.httpStatus}}</p>
    <p>{{$t('taskLogResponseInfo.headers')}} :<br> {{form.headers}}</p>
    <p>{{$t('taskLogResponseInfo.body')}} : <br>{{form.body}}</p>
  </a-modal>
</template>

<script lang="ts" setup>

const props = defineProps({
  form: {type: Object as any, default: () => ({})},
  visible: {type: Boolean, default: false},
})
const emit = defineEmits(['update:visible', 'ok'])
const bindVisible = ref(false)
watchEffect(() => (bindVisible.value = props.visible))
watchEffect(() => emit('update:visible', bindVisible.value))

const confirm = async () => {
  bindVisible.value = false
  emit('ok')
}

</script>
